@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
 	src:local('Open Sans'), 
 		local('OpenSans'),
 		url("../font/OpenSans-Regular.ttf") format('truetype'),
 		url("../font/OpenSans.woff") format('woff'); 		
}

body {
    padding:0;
    margin:0;
    background-color:white;    
    font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    text-align:center;	
}
#headerWrapper {
	width:100%;
	background-color:#000000;
	position:fixed;
	top:0;left:0;
    z-index:10000;
	height:50px;
	border-bottom:1px solid #999;
    box-shadow: 0px 2px 19px #aaa;
   -o-box-shadow: 0px 2px 19px #aaa;
   -webkit-box-shadow: 0px 2px 19px #aaa;
   -moz-box-shadow: 0px 2px 19px #aaa;
   opacity:0.8;
}

#header {
	margin-top:0;
    height:50px;
    font-size:80%;
	margin-left:auto;
	margin-right:auto;    
    width:950px;
    background-image:url(../../img/logo_bw_44h.jpg);
    background-repeat:no-repeat;  
    padding-left:50px;  
}

#intro {
	margin-top:59px;
}

#main_content 
{
	width: 100%;
	padding-left: 100px;
	height: 700px;
}

 #main {
    /* these two margins settings are here just to ensure that jsPlumb handles
    margins properly.*/  
    margin-top:50px;
    margin-left: auto;
    position: relative;
    font-size: 80%;
    margin-right: auto;
    width: 850px;
    border-left: 2px solid #456;
    border-right: 2px solid #456;
    border-bottom: 2px solid #456;
    height: 600px;
    overflow: hidden;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color:#eaedef;
}

#op_panel
{
	margin-top:80px;
    position: relative;
    font-size: 80%;
    width: 100px;
    border-left: 2px solid #456;
    border-right: 2px solid #456;
    border-top: 2px solid #456;
    border-bottom: 2px solid #456;
    height: 200px;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color:#eaedef;
    float: left;
}

#sidebar {            
    margin-left:auto;
	margin-right:auto;
    width:800px;        
    font-size:13px;    
}


/* demo elements */

.menu,#render, #explanation { 
    
	background-color:#fff;	    
}

.menu {    
    height: 15px;
	float:right;
    padding-top:1em;
    padding-bottom:0.4em;   
    background-color: transparent;
	margin-right:30px;
}

#render {
	padding-top:2px;
    margin-left:auto;
	margin-right:auto;
    z-index:5000;
	margin-top:0px;  
    text-align: center;
    background-color:white;
}

#render ul {
    padding-left:1em;
}
#render ul li {
    list-style-type:none;
}
#render h5 {
    display:inline;
}

.otherLibraries {
    display:inline;
}

a, a:visited {
    text-decoration:none;
    color:#01a3c6;    
    font-family:helvetica;
    padding:0.3em;
    border-radius:0.2em;
}

a:hover {
    color:#1b911b;
}

.selected {
	color:rgb(189,11,11) !important;
}

.window, .label { 
    background-color:white;
    text-align:center;
    z-index:23;
	cursor:pointer;
	box-shadow: 2px 2px 19px #aaa;
   -o-box-shadow: 2px 2px 19px #aaa;
   -webkit-box-shadow: 2px 2px 19px #aaa;
   -moz-box-shadow: 2px 2px 19px #aaa;
    
}
path, ._jsPlumb_endpoint { cursor:pointer; }

/* z index stuff */

._jsPlumb_connector { z-index:18; }
._jsPlumb_endpoint { z-index:19; }
._jsPlumb_overlay { z-index:23; }

._jsPlumb_connector._jsPlumb_hover {
    z-index:21 !important;
}

._jsPlumb_endpoint._jsPlumb_hover {
    z-index:22 !important;
}

.logoTitle 
{
	color: #00db00;
	font-size: 18pt;
	font-family: Consolas;
	text-align: center;
	font-weight: bold;
}
